<script lang="ts" setup>
import { computed, h } from 'vue';

import { DICT_TYPE } from '@vben/constants';
import { formatDate } from '@vben/utils';

import { DescriptionChange } from '#/components/description-change';
import { DictBadge } from '#/components/dict-badge';
import DictTag from '#/components/dict-tag/dict-tag.vue';

interface DescriptionItemSchema {
  label: string;
  field: string;
  span?: number;
  render?: (val: any) => any;
}

const props = defineProps<{ data?: any }>();
const formData = computed(() => props.data || {});

function formatDateSafe(
  date: null | string | undefined,
  format = 'YYYY-MM-DD',
) {
  if (!date) return '';
  const d = new Date(date);
  return Number.isNaN(d.getTime()) ? '' : formatDate(d, format);
}

/** 房产信息 Schema */
const propertySchema = computed<DescriptionItemSchema[]>(() => [
  {
    label: '与本人关系',
    field: 'relation',
    render: (val) => h(DictTag, { type: DICT_TYPE.PER_RELATION, value: val }),
    span: 12,
  },
  { label: '产权人姓名', field: 'familyName', span: 12 },
  {
    label: '证件类型',
    field: 'cardType',
    render: (val) =>
      h(DictTag, { type: DICT_TYPE.SYSTEM_CARD_TYPE, value: val }),
    span: 12,
  },
  { label: '产权人身份证号', field: 'familyIdcard', span: 12 },
  { label: '房产坐落地址', field: 'address', span: 24 },
  {
    label: '建筑年份',
    field: 'buildYear',
    render: (val) => formatDateSafe(val, 'YYYY'),
    span: 12,
  },
  {
    label: '建筑面积',
    field: 'buildArea',
    render: (val) => `${val}平方米`,
    span: 12,
  },
  {
    label: '房产性质',
    field: 'propertyType',
    render: (val) =>
      h(DictTag, { type: DICT_TYPE.PER_PROPERTY_TYPE, value: val }),
    span: 12,
  },
  {
    label: '交易时间',
    field: 'transactionDate',
    render: (val) => formatDateSafe(val),
    span: 12,
  },
  {
    label: '交易金额',
    field: 'transactionAmount',
    render: (val) => `${val}万元`,
    span: 12,
  },
  { label: '房产证编号', field: 'propertyCertNo', span: 12 },
  {
    label: '购房方式',
    field: 'purchaseMethod',
    render: (val) =>
      h(DictTag, { type: DICT_TYPE.PER_PURCHASE_METHOD, value: val }),
    span: 12,
  },
  {
    label: '是否为主要住宅',
    field: 'isPrimaryResidence',
    render: (val) =>
      h(DictBadge, {
        value: val,
      }),
    span: 12,
  },
  { label: '共有产权情况', field: 'coOwnership', span: 12 },
  { label: '房产来源/去向', field: 'propertySource', span: 12 },
  { label: '资金来源', field: 'fundSource', span: 12 },
  { label: '备注', field: 'remarks', span: 24 },
  {
    label: '状态',
    field: 'status',
    render: (val) => h(DictTag, { type: DICT_TYPE.COMMON_STATUS, value: val }),
    span: 12,
  },
  {
    label: '更新时间',
    field: 'updateTime',
    render: (val) => formatDateSafe(val),
    span: 12,
  },
]);
</script>

<template>
  <DescriptionChange
    v-if="formData"
    :info="formData"
    :schema="propertySchema"
    :change-list="formData.changeContent?.fieldChanges || []"
    :highlight-mode="formData.highlightMode"
    :change-type="formData.changeType"
    :label-width="120"
  />
</template>
